<template>
	<view class="balance_transfer_warp">
		<view class="recharge_content_warp">
			<view class="_content_common">
				<view class="_content_title_common">{{$t('mine.balance.transfer.user')}}</view>
				<up-input
					:placeholder="$t('mine.balance.transfer.user.placeholder')"
					border="surround"
					v-model="form.userId"
					:customStyle="inputCss"
					type="number"
				  ></up-input>
			</view>
			<view class="_content_common">
				<view class="_content_title_common">{{$t('mine.balance.transfer.amount')}}</view>
				<up-input
					:placeholder="$t('mine.balance.transfer.amount.placeholder')"
					border="surround"
					v-model="form.amount"
					:customStyle="inputCss"
					type="number"
					@change="checkAmount"
				>
					<template #suffix>
						USDT
					</template>
				  </up-input>
			</view>
			<view class="_content_common">
				<view class="reality_warp">
					<view class="reality_title_warp">{{$t("recharge.credited.account")}}</view>
					<view>
						<text class="reality_amount_warp">{{receivedAmount}}</text>
						<text class="reality_msg_warp">USDT</text>
					</view>
				</view>
				<view class="fee_warp">
					<text>{{$t("common.fee")}}：</text>
					<text class="fee_amount_warp">{{feeData}}%</text>
				</view>
			</view>
			<view class="_content_common">
				<view class="_content_title_common">{{$t("common.remarks")}}</view>
				<up-input
					:placeholder="$t('common.remarks.placeholder')"
					border="surround"
					v-model="form.remark"
					:customStyle="inputCss"
				  ></up-input>
			</view>
			<view class="_content_common">
				<view class="_content_title_common2">{{$t("common.warm.reminder")}}</view>
				<view class="_remark_warp">
					<view>{{$t('recharge.reminder')}}</view>
				</view>
			</view>
			<view class="but_comm_warp" @click="jumpPay">
				{{$t('mine.balance.transfer.ok')}}
			</view>
		</view>
		<up-toast ref="uToastRef"></up-toast>
	</view>
</template>

<script>
	import { getTransferFeeRate,walletTransfer } from '@/api/finance.js';
	import { TRABSFER_TYPE } from '@/utils/enumUtils.js';
	
	export default {
		data() {
			return {
				form:{
					userId:'',
					amount:'',
					remark:'',
				},
				receivedAmount:0,// 实际到账
				feeData:0,// 手续费
				inputCss:{
					"height":'80rpx',
					"background": "#F3F3F3FF",
					"border-radius": "20rpx",
					"border": "0rpx",
					"padding-left": "16px",
				},
			};
		},
		mounted() {
			this.getTransferFeeRateFun();
		},
		methods: {
			async jumpPay(){
				const param=this.form;
				if(!param.userId){
					this.$refs.uToastRef.show({
						type: 'error',
						message: this.$t("mine.balance.transfer.user.placeholder"),
					});
					return false;
				}
				if(!param.amount){
					this.$refs.uToastRef.show({
						type: 'error',
						message: this.$t("mine.balance.transfer.amount.placeholder"),
					});
					return false;
				}
				const resp = await walletTransfer(param);
				if(resp && resp.bizcode === 100){
					console.log("resp",resp);
					this.$refs.uToastRef.show({
						type: 'success',
						message: this.$t("recharge.ok"),
					});
					setTimeout(()=>{
						uni.switchTab({
							url:"/pages/mine/mine",
						})
					},1500)
				}
			},
			/**
			 * 自定义金额
			 * @param {Object} value
			 */
			checkAmount(value){
				const feeData = this.feeData / 100;
				let amount = value;
				if(feeData){
					amount = (amount - amount * feeData).toFixed(2);
				}
				this.receivedAmount = amount;
			},
			/**
			 * 查询手续费
			 */
			async getTransferFeeRateFun(){
				const params = {
					type:TRABSFER_TYPE.WALLET
				}
				const resp = await getTransferFeeRate(params);
				if(resp && resp.bizcode === 100){
					let feeData = 0;
					if(resp.data){
						feeData = resp.data * 100
					}
					this.feeData = feeData;
				}
			}
		}
	}
</script>

<style lang="scss">
	.balance_transfer_warp{
		.but_comm_warp{
			margin-top: 100rpx;
		}
	}
	
</style>
